<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Escaping Smarty Parsing</title>
<meta name="generator" content="DocBook XSL Stylesheets V1.75.2">
<link rel="home" href="index.html" title="Smarty 3 Manual">
<link rel="up" href="language.basic.syntax.html" title="Chapter 3. Basic Syntax">
<link rel="prev" href="language.math.html" title="Math">
<link rel="next" href="language.variables.html" title="Chapter 4. Variables">
</head>
<body bgcolor="white" text="black" link="#0000FF" vlink="#840084" alink="#0000FF">
<div class="navheader">
<table width="100%" summary="Navigation header">
<tr><th colspan="3" align="center">Escaping Smarty Parsing</th></tr>
<tr>
<td width="20%" align="left">
<a accesskey="p" href="language.math.html">Prev</a> </td>
<th width="60%" align="center">Chapter 3. Basic Syntax</th>
<td width="20%" align="right"> <a accesskey="n" href="language.variables.html">Next</a>
</td>
</tr>
</table>
<hr>
</div>
<div class="sect1" title="Escaping Smarty Parsing">
<div class="titlepage"><div><div><h2 class="title" style="clear: both">
<a name="language.escaping"></a>Escaping Smarty Parsing</h2></div></div></div>
<p>
  It is sometimes desirable or even necessary to have Smarty ignore sections it
  would otherwise parse. A classic example is embedding Javascript or CSS code in
  a template. The problem arises as those languages use the { and } characters
  which are also the default
  <a class="link" href="language.function.ldelim.html" title="{ldelim},{rdelim}">delimiters</a> for Smarty.
 </p>
<div class="note" title="Note" style="margin-left: 0.5in; margin-right: 0.5in;">
<h3 class="title">Note</h3>
<p>
  A good practice for avoiding escapement altogether is by separating your Javascript/CSS
  into their own files and use standard HTML methods to access them. This will also take
  advantage of browser script caching. When you need to embed Smarty variables/functions
  into your Javascript/CSS, then the following applies.
 </p>
</div>
<p>
  In Smarty templates, the { and } braces will be ignored so long as they are surrounded by white space.
  This behavior can be disabled by setting the Smarty class variable <a class="link" href="variable.auto.literal.html" title="$auto_literal"><em class="parameter"><code>$auto_literal</code></em></a> to false.
 </p>
<div class="example">
<a name="id344870"></a><p class="title"><b>Example 3.8. Using the auto-literal feature</b></p>
<div class="example-contents"><pre class="programlisting">

&lt;script&gt;
   // the following braces are ignored by Smarty
   // since they are surrounded by whitespace
   function foobar {
	alert('foobar!');
   }
   // this one will need literal escapement
   {literal}
	function bazzy {alert('foobar!');}
   {/literal}
&lt;/script&gt;
  
 </pre></div>
</div>
<br class="example-break"><p>
  <a class="link" href="language.function.literal.html" title="{literal}">
  <code class="varname">{literal}..{/literal}</code></a> blocks are used for escaping blocks of template logic.
  You can also escape the braces individually with <a class="link" href="language.function.ldelim.html" title="{ldelim},{rdelim}"><code class="varname">{ldelim}</code></a>,<a class="link" href="language.function.ldelim.html" title="{ldelim},{rdelim}"><code class="varname">{rdelim}</code></a> tags or <a class="link" href="language.variables.smarty.html#language.variables.smarty.ldelim" title="{$smarty.ldelim}, {$smarty.rdelim}">
  <code class="varname">{$smarty.ldelim}</code>,<code class="varname">{$smarty.rdelim}</code></a> variables.
 </p>
<p>
  Smarty's default delimiters { and } cleanly represent presentational content. However if another set of delimiters suit your
  needs better, you can change them with Smarty's <a class="link" href="variable.left.delimiter.html" title="$left_delimiter">
  <em class="parameter"><code>$left_delimiter</code></em></a> and
  <a class="link" href="variable.right.delimiter.html" title="$right_delimiter">
  <em class="parameter"><code>$right_delimiter</code></em></a> values.
  </p>
<div class="note" title="Note" style="margin-left: 0.5in; margin-right: 0.5in;">
<h3 class="title">Note</h3>
<p>
      Changing delimiters affects ALL template syntax and escapement. Be sure to clear out cache and compiled files
      if you decide to change them.
    </p>
</div>
<p>
 </p>
<div class="example">
<a name="id345357"></a><p class="title"><b>Example 3.9. changing delimiters example</b></p>
<div class="example-contents">
<pre class="programlisting">

&lt;?php

$smarty-&gt;left_delimiter = '&lt;!--{';
$smarty-&gt;right_delimiter = '}--&gt;';

$smarty-&gt;assign('foo', 'bar');
$smarty-&gt;assign('name', 'Albert');
$smarty-&gt;display('example.tpl');

?&gt;

  </pre>
<p>
   Where the template is:
  </p>
<pre class="programlisting">

Welcome &lt;!--{$name}--&gt; to Smarty
&lt;script language="javascript"&gt;
  var foo = &lt;!--{$foo}--&gt;;
  function dosomething() {
    alert("foo is " + foo);
  }
  dosomething();
&lt;/script&gt;

  </pre>
</div>
</div>
<br class="example-break">
</div>
<div class="navfooter">
<hr>
<table width="100%" summary="Navigation footer">
<tr>
<td width="40%" align="left">
<a accesskey="p" href="language.math.html">Prev</a> </td>
<td width="20%" align="center"><a accesskey="u" href="language.basic.syntax.html">Up</a></td>
<td width="40%" align="right"> <a accesskey="n" href="language.variables.html">Next</a>
</td>
</tr>
<tr>
<td width="40%" align="left" valign="top">Math </td>
<td width="20%" align="center"><a accesskey="h" href="index.html">Home</a></td>
<td width="40%" align="right" valign="top"> Chapter 4. Variables</td>
</tr>
</table>
</div>
</body>
</html>
